<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    
    <title>配置管理系统</title>
  	<link href="/static/css/bootstrap.min.css" rel="stylesheet" /> 
    <link rel="stylesheet" type="text/css" href="/static/css/tcal.css" />
     
    <script src="/static/js/jquery.min.js"></script> 
    <script src="/static/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="/static/js/tcal.js"></script> 
    <link rel="stylesheet" href="/static/css/datepicker/css/reset.css" type="text/css">
    <link rel="stylesheet" href="/static/css/datepicker/css/default.css" type="text/css">
    <link rel="stylesheet" href="/static/css/datepicker/css/style.css" type="text/css">
    <script type="text/javascript" src="/static/css/datepicker/javascript/jquery-1.11.1.js"></script>
    <script type="text/javascript" src="/static/css/datepicker/javascript/zebra_datepicker.js"></script>
    <script type="text/javascript" src="/static/css/datepicker/javascript/core.js"></script>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
     <table width="620" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
    <th scope="col">
    <!--form action="/bi_human/" method="get">
            <input id="datepicker-example1" type="text" name="query1" value=""/>
            <input id="datepicker-example9" type="text" name="query2" value=""/>
            <input type="submit" value="按时间搜索">
    </form-->
    </tr>
    </table>
	<div class="row"> 
	    <div class="span3">
	    	<div id="main" style="height:280px;width:400px"></div>
	    	<div id="main1" style="height:280px;width:400px"></div>
		</div>
		<div class="span2">
	    	<div id="main6" style="height:560px"></div>
		</div>
		<div class="span3">
	    	<div id="main2" style="height:280px;width:400px"></div>
	    	<div id="main3" style="height:280px;width:400px"></div>
		</div>
		<div class="span1">
	    	<div id="main4" style="height:560px"></div>
		</div>
		<div class="span6" >
		    <div id="main5" style="height:500px;width:700px"></div>
		</div> 
	</div> 
    <!--div id="main" style="height:600px"></div-->
    <!-- ECharts单文件引入 -->
    <script src="/static/js/echarts.js"></script>
    <script type="text/javascript">
	
        // 路径配置
        require.config({
            paths: {
                echarts: '/static/js/build/dist'
            }
        });
        
        // 使用
        require(
            [
                'echarts',
                'echarts/chart/bar',
                'echarts/chart/line' 
            ],
            function (ec) {
                // 基于准备好的dom，初始化echarts图表
                var myChart = ec.init(document.getElementById('main'));
                var myChart1 = ec.init(document.getElementById('main1'));
                var myChart2 = ec.init(document.getElementById('main2'));
                var myChart3 = ec.init(document.getElementById('main3'));
                var myChart5 = ec.init(document.getElementById('main5'));
                
		
		
		option = {
    title : {
        x : 'center',
        text: '项目进度状态',
        subtext:'{{month_tag}}'
         
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        show : true,
        x:'left',
        feature : {
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    xAxis : [
        {
            type : 'category',
            splitLine :{show:false},
            data : [{% for name in overallschedule_namedata %}
					'{{ name }}',
	               {% endfor %} ]
        }
    ],
    yAxis : [
        {
            type : 'value',
            splitLine :{show:true}
        }
    ],
    series : [
        {
            name:'项目进度状态',
            type:'bar',
            itemStyle : { normal: {label : {show: true, position: 'top'}}},
            data:[{% for num in overallschedule_data %}
					{{ num }},
	               {% endfor %}
	             ]
            
        }
    ]
};

option1 = {
    title : {
        x : 'center',
        text: '质量情况'
         
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        show : true,
        x:'left',
        feature : {
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    xAxis : [
        {
            type : 'category',
            splitLine :{show:false},
            data : [{% for name in versionquality_namedata %}
					'{{ name }}',
	               {% endfor %} ]
        }
    ],
    yAxis : [
        {
            type : 'value',
            splitLine :{show:true}
        }
    ],
    series : [
        {
            name:'质量情况',
            type:'bar',
            itemStyle : { normal: {label : {show: true, position: 'top'}}},
            data:[ {% for num in versionquality_data %}
					{{ num }},
	               {% endfor %}            
	            ]
            
        }
    ]
};

option2 = {
    title : {
        x : 'center',
        text: '人力情况'
         
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        show : true,
        x:'left',
        feature : {
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    xAxis : [
        {
            type : 'category',
            splitLine :{show:false},
            data : [{% for name in manpowerinput_namedata %}
					'{{ name }}',
	               {% endfor %} ]
        }
    ],
    yAxis : [
        {
            type : 'value',
            splitLine :{show:true}
        }
    ],
    series : [
        {
            name:'人力情况',
            type:'bar',
            itemStyle : { normal: {label : {show: true, position: 'top'}}},
            data:[{% for num in manpowerinput_data %}
					{{ num }},
	               {% endfor %}            
	            ]
        }
    ]
};


option3 = {
    title : {
        x : 'center',
        text: '工作量情况'
         
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        show : true,
        x:'left',
        feature : {
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    xAxis : [
        {
            type : 'category',
             splitLine :{show:false},
            data : [{% for name in workload_namedata %}
					'{{ name }}',
	               {% endfor %} ]
        }
    ],
    yAxis : [
        {
            type : 'value',
            splitLine :{show:true}
        }
    ],
    series : [
        {
            name:'工作量情况',
            type:'bar',
            itemStyle : { normal: {label : {show: true, position: 'top'}}},
            data:[{% for num in workload_data %}
					{{ num }},
	               {% endfor %}            
	            ]
            
        }
    ]
};
	
	
	
option5 = {
    title : {
        x : 'center',
        text: '项目阶段情况'
         
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        show : true,
        feature : {
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    xAxis : [
        {
            type : 'category',
            splitLine :{show:false},
            data : [{% for name in projectstage_namedata %}
					'{{ name }}',
	               {% endfor %} ]
        }
    ],
    yAxis : [
        {
            type : 'value',
            splitLine :{show:true}
        }
    ],
    series : [
        {
            name:'项目阶段情况',
            type:'bar',
            itemStyle : { normal: {label : {show: true, position: 'top'}}},
            data:[{% for num in projectstage_numdata %}
					{{ num }},
	               {% endfor %}            
	            ]
            
        }
    ]
};
		
	
		myChart.setOption(option);
		myChart1.setOption(option1);
		myChart2.setOption(option2);
		myChart3.setOption(option3);
		myChart5.setOption(option5);
		
		//myChart.on(ecConfig.EVENT.CLICK, eConsole);
		myChart.on(ecConfig.EVENT.DBLCLICK, eConsole);
		//myChart.on(ecConfig.EVENT.HOVER, eConsole);
		//myChart.on(ecConfig.EVENT.DATA_ZOOM, eConsole);
		//myChart.on(ecConfig.EVENT.LEGEND_SELECTED, eConsole);
		//myChart.on(ecConfig.EVENT.MAGIC_TYPE_CHANGED, eConsole);
		//myChart.on(ecConfig.EVENT.DATA_VIEW_CHANGED, eConsole);
		
		}
		);
		
	
	
	
    </script>
    
    <div style = "margin: 0; font-size: 11px; text-align: right; color: #487858;">
		<a href="/upload_file/">| 文件上传</a> |
		<a href="/system_detail/">系统详情页</a> |
		<a href="/version_detail/">版本详情页</a> |
		<a href="/wiki_index/">系统百科页</a> |
		<a href="/dataex_detail/">交互信息展示页</a> |
		<a href="/cm_baseline/">基线展示页</a> |
		<a href="/cm_bi_index/">报表展示页</a> |
		<a href="/test_report_index/">测试周报页</a> |
	</div>
</body>